<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <!-- 引入Vue -->
    <script type="text/javascript" src="../js/vue.js"></script>
</head>
<!-- V-html 用于解析后端传过来的模态框信息 -->
<!-- V-on 用于绑定事件 -->

<body>
    <div id="id">
        <div v-if="isShow">看了看</div>
        <div v-show="isShow">你看嘛</div>
        <!-- <button v-on:click="num++">{{num}}点我加一</button> -->
        <!-- 可以简写 -->
        <button @click="num++">{{num}}点我加一</button>
        <button v-on:click="demo">{{num}}点我减一</button>
    </div>

    <script>
        new Vue({
            el: '#id',  //挂载的标签元素 类似于 
            data: {
                isShow: false,
                num: 20
            },
            methods: {
                demo(){
                    console.log('111111111111111',this.num);
                    
                }
            },
        })
    </script>
</body>

</html>